<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<link rel="stylesheet" href="../css/mui.min.css">
	<link rel="stylesheet" type="text/css" href="../css/goods/iconfont.css" />
	<link rel="stylesheet" type="text/css" href="../css/goods/shouhou_add_address.css" />

	<!-- <link rel="stylesheet" type="text/css" href="../css/goods/confirm_order.css" /> -->
	<link rel="stylesheet" href="../css/mui.picker.min.css">
	<script type="text/javascript">
        (function() {
            var clientWidth = document.documentElement ? document.documentElement.clientWidth : document.body.clientWidth;
            clientWidth = clientWidth || localStorage.getItem("clientWidth")
            if(clientWidth > 750)
                clientWidth = 750;
            document.documentElement.style.fontSize = clientWidth * 1 / 16 + "px";
        })();
	</script>

</head>

<body>

<header class="mui-bar mui-bar-nav" style="border-bottom: 1px solid #c5c5c5">
	<a class="mui-action-back mui-icon  mui-pull-left arr_left">
	</a>
	<h1 class="mui-title">发表图文</h1>
	<a class="mui-pull-right" onclick = "app.sub_this()">发表</a>
</header>
<div class="mui-content">

	<div class="address_form">
		<div class="text_info">
			<textarea class="fs_28" v-model="text_area" name="" rows="" placeholder="这一刻的想法..." cols=""></textarea>
		</div>
		<div class="hr_20"></div>
		<div class="imgs fbwz">

			<div id="has_img">

				<div class="img_item" v-for="(i,k) in imgs">
					<div class="has_img"><img :src="i.pic" /></div>

					<i class="mui-icon mui-icon-closeempty" @click="del_this(k)"></i>
				</div>

			</div>
			<div class="img_item add_img" @click="open_pic" v-show="add_img_flag">
				<i class="iconfont icon-paizhao"></i>
				<div class="fs_20">最多三张</div>
			</div>
		</div>

    </div>
    
    
	<div id="sheet1" class="mui-popover mui-popover-bottom mui-popover-action ">
		<!-- 可选择菜单 -->
		<ul class="mui-table-view">
			<li class="mui-table-view-cell" id="paizhao">
				<a href="#">拍照</a>
			</li>
			<li class="mui-table-view-cell" id="xiangce">
				<a href="#">相册</a>
			</li>
		</ul>
		<!-- 取消菜单 -->
		<ul class="mui-table-view">
			<li class="mui-table-view-cell">
				<a href="#sheet1"><b>取消</b></a>
			</li>
		</ul>
	</div>
</div>

<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/js.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/tools/upload_img.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    var arr = []
    var app = new Vue({
        el: ".mui-content",
        data: {
            imgs: [],
            add_img_flag: true,
            text_area:''
        },
        methods: {
            open_pic: function() {
                mui('#sheet1').popover('toggle');
            },
            del_this:function(k){
                this.imgs.splice(k,k+1);
                if(this.imgs.length >= 3) { //控制上传图片数量
                    this.add_img_flag = true;
                }else{
                    this.add_img_flag = true;
                }
            },
            sub_this:function(){
            	var uid = Storage.get('user')
            	if (uid == null || uid == undefined) {
            		mui.toast('未登录，请先登录',{ duration:'long', type:'div' })
            		return false;
            	}
                //提交本页面
                var pics = "";
		        var imgs = app.imgs;
		        
		        
		      
		        for(var j=0;j<imgs.length;j++){
		          pics += imgs[j].pic+","
		        };
		        pics = pics.slice(0,pics.length-1)
                var content  = app.text_area;
                console.log(pics);
           
//              var arrimg = []
//              for (var i = 0; i < app.imgs.length; i++) {
//                  arrimg.push(app.imgs[i].pic)
//              }
                //console.log(arrimg);
                var sqid = Storage.get('address').sqid;
                console.log(uid.uid)
                mui.post(url+"api/system/comment_store",{uid:uid.uid,bid:sqid,sqid:sqid,pics:pics,content:content},function(data){
                    
                    if(data.code == 1){
                    	mui.toast("发表成功,正在审核中")
                    	 setTimeout(function(){
							 plus.webview.currentWebview().close()
						 },500)
                    }
                },'json')
//              mui.ajax(url+"api/user/comment_store",{
//					data:{
//						bid:123,
//						uid:
//						pics:'pics',
//						arrimg:'arrimg'
//					},
//					dataType:'json',//服务器返回json格式数据
//					type:'post',//HTTP请求类型
//					timeout:10000,//超时时间设置为10秒；
//					headers:{'Content-Type':'application/json'},
//					success:function(data){
//						//服务器返回响应，根据响应结果，分析是否登录成功；
//						...
//					},
//					error:function(xhr,type,errorThrown){
//						//异常处理；
//						console.log(type);
//					}
//				});
            }
        },
        mounted: function() {
            var that = this;

            ts.select_img('xiangce', function(path) {
                
                mui('#sheet1').popover('hide');
                that.imgs.push({
                    pic: path
                });
                if(that.imgs.length >= 3) { //控制上传图片数量
                    that.add_img_flag = false;
                }
            });
            ts.get_img('paizhao', function(path) {
                 
                mui('#sheet1').popover('hide');
                that.imgs.push({
                    pic: path
                });
                if(that.imgs.length >= 3) { //控制上传图片数量
                    that.add_img_flag = false;
                }
            });
        }
    })

    //上传成功后
    //						this.imgs.push({
    //							pic:'../images/index_g4.png'
    //						});
    //						if(this.imgs.length>=3){ 	//控制上传图片数量
    //							this.add_img_flag=false;
    //						}

</script>
</body>

</html>